﻿<!--
	@create by 
	@update by 
	@description 
-->
<div>
  <el-row>
    <el-col :span="4">
    	<el-input placeholder="输入角色名称进行过滤" v-model="roleName"> </el-input>
        <el-tree 
        		:style="autoStyle" 
        		class="filter-tree"
		        :data="role.roles"
		        :props="role.props"
		        default-expand-all
		        :filter-node-method="filterRoleNode"
		        :highlight-current="true"
		        :expand-on-click-node="false"
		        ref="roleTree"
		        @node-click="nodeClickFn">
		</el-tree>
    </el-col>
    <el-col :span="20">
		<el-form-q :field-data="queryFields" :buttons="queryButtons"></el-form-q>
	 	<div class="yu-toolBar">
		    <el-button-group>
		      <el-button icon="plus" @click="addFn" v-if="checkPermission('create')">新增</el-button>
		      <el-button icon="edit" @click="modifyFn" v-if="checkPermission('edit')">修改</el-button>
		      <el-button icon="document" @click="infoFn" v-if="checkPermission('detail')">查看</el-button>
		      <el-button icon="yx-bin" @click="deleteFn" v-if="checkPermission('delete')">注销</el-button>
		    </el-button-group>
	   </div>
	   <el-table-x ref="reftable" :row-index="true" :radiobox="false" :base-params="baseParams"
	        :data-url="dataUrl" :table-columns="tableColumns" :request-type="'POST'" :default-load="false"></el-table-x>
	        
	   <!-- 说明dialog可配置宽高属性，若不配置则宽度默认为屏幕50%，高度自适应width="650px" height="380px" -->
	   <el-dialog-x :title="viewTitle[viewType]" :visible.sync="dialogVisible" size="large">
	     <el-form-x ref="reform"
	           :group-fields="updateFields" :buttons="updateButtons"
	           :disabled="formDisabled" label-width="150px"></el-form-x>
	   </el-dialog-x>
   </el-col>
   
  </el-row>
</div>
